<template>
    <div>
        <Table :columns="columns" :data="shortData">
            <!-- 状态 -->
            <template #status="{row}">
                <tag color="red" v-if="row.status==-1">删除</tag>
                <tag color="green" v-if="row.status==0">编辑</tag>
                <tag color="green" v-if="row.msg=='success'">成功</tag>
            </template>
        </Table>
        <Page :total="total" :current="current" :page-size-opts="pageSizeOpts" size="small" show-elevator show-sizer
            show-total @on-change="pageChange" @on-page-size-change="pageSizeChange"></Page>
    </div>
</template>

<script>
    import api from '@/api/apis/common.js'
    export default {
        name: 'UiShortPage',

        data() {
            return {
                columns: [
                    {
                        title: 'No. ',
                        type: 'index',
                        width: '60'
                    },
                    {
                        title: '类型',
                        key: 'type',
                        width: '150'
                    },
                    {
                        title: '状态',
                        key: 'msg',
                        slot: 'status',
                        width: '150'
                    },
                    {
                        title: '时间',
                        key: 'time',
                        width: '150'
                    },
                    {
                        title: '内容',
                        key: 'content'
                    }
                ],
                shortData: [],
                pageSizeOpts: [10, 20, 30, 40, 100],
                total: 0,
                current: 1,
                pageSize: 10
            }
        },

        mounted() {

            // this.findList();
        },

        methods: {

            findList() {
                let param = {
                    "current": this.current,
                    "size": this.pageSize
                }
                api.findShort(param).then(res => {
                    this.shortData = res.data.data.records
                    this.total = res.data.data.total
                    console.log(res.data);
                })
            },
            pageChange(current) {
                this.current = current;
                this.findList();
            },
            pageSizeChange(pageSize) {
                this.pageSize = pageSize;
                this.findList();
            }
        },
    };
</script>

<style lang="scss" scoped>

</style>